import { StyleSheet, Pressable } from 'react-native';
import { router } from 'expo-router';
import FontAwesome from '@expo/vector-icons/FontAwesome';

import EditScreenInfo from '@/components/EditScreenInfo';
import { Text, View } from '@/components/Themed';
import Colors from '@/constants/Colors';
import { useColorScheme } from '@/components/useColorScheme';

export default function AssetsScreen() {
  const colorScheme = useColorScheme();

  const handleSettingsPress = () => {
    router.push('/pages/setting/settings?from=asset&userId=12345');
  };

  return (
    <View style={styles.container}>
      <Text style={styles.title}>AssetsScreen</Text>
      <View style={styles.separator} lightColor="#eee" darkColor="rgba(255,255,255,0.1)" />
      
      {/* 设置按钮 */}
      <Pressable style={styles.settingsButton} onPress={handleSettingsPress}>
        {({ pressed }) => (
          <View style={[styles.buttonContent, { opacity: pressed ? 0.5 : 1 }]}>
            <FontAwesome
              name="cog"
              size={20}
              color={Colors[colorScheme ?? 'light'].text}
              style={styles.buttonIcon}
            />
            <Text style={styles.buttonText}>设置</Text>
          </View>
        )}
      </Pressable>
      
      <EditScreenInfo path="app/(tabs)/four.tsx" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },
  title: {
    fontSize: 20,
    fontWeight: 'bold',
  },
  separator: {
    marginVertical: 30,
    height: 1,
    width: '80%',
  },
  settingsButton: {
    marginVertical: 20,
    paddingHorizontal: 20,
    paddingVertical: 12,
    borderRadius: 8,
    backgroundColor: '#007AFF',
  },
  buttonContent: {
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'center',
  },
  buttonIcon: {
    marginRight: 8,
  },
  buttonText: {
    color: 'white',
    fontSize: 16,
    fontWeight: '600',
  },
});
